<html>
<meta charset="UTF-8">

<table border="1" >
<tr>
<td colspan="4"><input id = "result" button onclick="cal()"> </button></td>
</tr>
<tr>
<td><button onclick="清零()">AC</button></td>
<td><button onclick="FuHao()">+/-</button></td>
<td><button onclick="BaiFenHao()">%</button></td>
<td><button onclick="Chu()">/</button></td>
</tr>
<tr>
<td><button onclick="s7()">7</button></td>
<td><button onclick="s8()">8</button></td>
<td><button onclick="s9()">9</button></td>
<td><button onclick="Cheng()">*</button></td>
</tr>
<tr>
<td><button onclick="s4()">4</button></td>
<td><button onclick="s5()">5</button></td>
<td><button onclick="s6()">6</button></td>
<td><button onclick="Jian()">-</button></td>
</tr>
<tr>
<td><button onclick="s1()">1</button></td>
<td><button onclick="s2()">2</button></td>
<td><button onclick="s3()">3</button></td>
<td><button onclick="Add()">+</button></td>
</tr>
<tr>
<td colspan="2"><button onclick="s0()">0</button></td>
<td><button onclick="Dian">.</button></td>
<td><button onclick="DengYu()">=</button></td>
</tr>
</table>

<script>
 var n1;
   var n2;
function 清零(){
             result.value="";
}
  function s1(){ 
       result.value=result.value+1;
    }
  function s2(){ 
       result.value=result.value+2;
    }
 function s3(){ 
       result.value=result.value+3;
    }
 function s4(){ 
       result.value=result.value+4;
    }
 function s5(){ 
       result.value=result.value+5;
    }
 function s6(){ 
       result.value=result.value+6;
    }
 function s7(){ 
       result.value=result.value+7;
    }
 function s8(){ 
       result.value=result.value+8;
    }
 function s9(){ 
       result.value=result.value+9;
    }
 function s0(){ 
       result.value=result.value+0;
    }
 function Dian(){ 
       if(result.value.indexOf(".")==-1)
  {
           result.value = result.value + ".";
 }
    }
  function Add(){ 
      n1=parseFloat(result.value);
 
       result.value="";
       n2="Add";
    }
  function Jian(){ 
      n1=parseFloat(result.value);
 
       result.value="";
       n2="Jian";
    }
function Cheng(){ 
      n1=parseFloat(result.value);
 
       result.value="";
       n2="Cheng";
    }
function Chu(){ 
      n1=parseFloat(result.value);
 
       result.value="";
       n2="Chu";
    }
  function DengYu(){ 
       if(n2=="Jia"){
           result.value=n1+parseFloat(result.value);}
       if(n2=="Jian"){
           result.value=n1-parseFloat(result.value);}
      if(n2=="Cheng"){
           result.value=n1*parseFloat(result.value);}
     if(n2=="Chu"){
           result.value=n1/parseFloat(result.value);}   
    }

</script>

</html>